<template>
    <div class="scfs">
        <div class="bg-container">
            <!-- 新增计划订单 -->
            <div class="my-header">

                <div style="height: 24px;width: 100%;border-bottom: 1px solid #e5e7eb; margin-bottom: 15px;"></div>

                <div class="search-form" v-if="headerShow">
                    <a-form :model="fromList">
                        <a-row class="grid-demo">
                            <a-col :span="6">
                                <a-form-item field="endTime" label="下单日期：" label-col-flex="70px">
                                    <!-- <a-date-picker  popup-container="html"  v-model="fromList.endTime" style="width: 200px;" /> -->
                                    <a-range-picker  popup-container="html"  @change="onChange" @select="onSelect"
                                        style="width: 270px; marginBottom: 20px;" />
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="clientDyeCode" label="染整单号：" label-col-flex="70px">
                                    <!-- <a-input v-model="fromList.ColorId" /> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.clientDyeCode" :filter-option="false" allow-search
                                        @focus="focusSel(1)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }">
                                        <a-option v-for="item in pageDataList" :label="item.clientDyeCode"
                                            :value="item.clientDyeCode">{{ item.clientDyeCode }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="customName" label="客户名称：" label-col-flex="70px">
                                    <!-- <a-input v-model="fromList.ColorName" /> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.customName" :filter-option="false" allow-search
                                        @focus="focusSel(2)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }">
                                        <a-option v-for="item in pageDataList" :label="item.customName"
                                            :value="item.customName">{{ item.customName }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="finishedClothCode" label="成品布号：" label-col-flex="98px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.customName" allow-clear>
                                        <a-option v-for="item of basicData.custom" :value="item.id" :key="item.id"
                                            :label="item.customName" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearchBh"
                                        v-model="fromList.finishedClothCode" :filter-option="false" allow-search
                                        @focus="focusSelBh" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }">
                                        <a-option v-for="item in pageDataList" :label="item.finishedClothCode"
                                            :value="item.finishedClothCode">{{ item.finishedClothCode }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="delEndTime" label="交货日期：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>

                                    </a-select> -->
                                    <a-range-picker  popup-container="html"  @change="onChange" @select="onSelect"
                                        style="width: 270px; marginBottom: 20px;" />

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="customOrderCode" label="客订单号：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>

                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.customOrderCode" :filter-option="false" allow-search
                                        @focus="focusSel(3)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                                        <a-option v-for="item in pageDataList" :label="item.customOrderCode"
                                            :value="item.customOrderCode">{{ item.customOrderCode }}</a-option>
                                    </a-select>

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="customOrderName" label="客订名称：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                                        <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                                            :label="item.detailName" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.customOrderName" :filter-option="false" allow-search
                                        @focus="focusSel(4)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }">
                                        <a-option v-for="item in pageDataList" :label="item.customOrderName"
                                            :value="item.customOrderName">{{ item.customOrderName }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="greyCode" label="坯布编号：" label-col-flex="98px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                                        <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                                            :label="item.text" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearchSh"
                                        v-model="fromList.greyCode" :filter-option="false" allow-search
                                        @focus="focusSelSh(1)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }">
                                        <a-option v-for="item in pageDataList" :label="item.clothCode"
                                            :value="item.clothCode">{{ item.clothCode }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>


                            <a-col :span="6">
                                <a-form-item field="colorCode" label="色号：" label-col-flex="70px" style="height:52px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>

                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearchSh"
                                        v-model="fromList.colorCode" :filter-option="false" allow-search
                                        @focus="focusSelSh(1)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                                        <a-option v-for="item in pageDataList" :label="item.colorCode"
                                            :value="item.colorCode">{{ item.colorCode }}</a-option>
                                    </a-select>

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="colorName" label="色称：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.genDanCode" allow-clear>

                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.colorName" :filter-option="false" allow-search
                                        @focus="focusSelSh(2)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                                        <a-option v-for="item in pageDataList" :label="item.colorName"
                                            :value="item.colorName">{{ item.colorName }}</a-option>
                                    </a-select>

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="orderNature" label="订单性质：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                                        <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                                            :label="item.detailName" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.orderNature" :filter-option="false" allow-search
                                        @focus="focusSel(5)" style="width:270px;"
                                        :trigger-props="{ autoFitPopupMinWidth: true }" @change="selectChange">
                                        <a-option v-for="item in pageDataList" :label="item.orderNature"
                                            :value="item.orderNature">{{ item.orderNature }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="placeDepartment" label="下单部门：" label-col-flex="98px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                                        <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                                            :label="item.text" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.placeDepartment" :filter-option="false" allow-search
                                        style="width:270px;" :trigger-props="{ autoFitPopupMinWidth: true }"
                                        @change="selectChange" @focus="focusSel(6)">
                                        <a-option v-for="item in pageDataList" :label="item.placeDepartment"
                                            :value="item.placeDepartment">{{ item.placeDepartment }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>

                            <a-col :span="6">
                                <a-form-item field="auditState" label="订单状态：" label-col-flex="70px" style="height:52px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.clientDyeCode" allow-clear>

                                    </a-select> -->
                                    <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.auditState" style="width:270px">
                                        <a-option value="ok">已审核</a-option>
                                        <a-option value="Y">未审核</a-option>
                                    </a-select>

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="craftState" label="工艺状态：" label-col-flex="70px">
                                    <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.craftState" style="width:270px">
                                        <a-option value="ok">所有工艺</a-option>
                                        <a-option value="Y1">布号不存在</a-option>
                                        <a-option value="Y2">工艺流程不存在</a-option>
                                        <a-option value="Y3">坯布编号不存在</a-option>
                                    </a-select>

                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="openOrderState" label="开单状态：" label-col-flex="70px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.dyType" allow-clear>
                                        <a-option v-for="item of basicData.orderNature" :value="item.id" :key="item.id"
                                            :label="item.detailName" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.openOrderState"
                                        style="width:270px">
                                        <a-option value="ok">已开齐</a-option>
                                        <a-option value="Y1">待开单：有坯布未开齐</a-option>
                                        <a-option value="Y2">欠坯：没有坯布库存</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>
                            <a-col :span="6">
                                <a-form-item field="cards" label="已下流转卡号：" label-col-flex="98px">
                                    <!-- <a-select popup-container="html"  :style="{ width: '320px' }" v-model="fromList.account" allow-clear>
                                        <a-option v-for="item of basicData.hrEmployee" :value="item.id" :key="item.id"
                                            :label="item.text" />
                                    </a-select> -->
                                    <a-select popup-container="html"  :loading="loading" :allowClear="true" @search="handleSearch"
                                        v-model="fromList.cards" :filter-option="false" @focus="focusSelLz"
                                        style="width:270px;" :trigger-props="{ autoFitPopupMinWidth: true }" multiple>
                                        <a-option v-for="item in pageDataList" :label="item.flowCardCode"
                                            :value="item.flowCardCode">{{ item.flowCardCode }}</a-option>
                                    </a-select>
                                </a-form-item>
                            </a-col>


                        </a-row>

                    </a-form>
                </div>

                <div class="my-divisders">
                    <a-divider orientation="center">
                        <icon-double-up v-if="headerShow" @click="headerShow = false" :strokeWidth="2" :size="18" />
                        <icon-double-down v-else @click="headerShow = true" :strokeWidth="2" :size="18" />
                    </a-divider>
                </div>


                <div class="my-tool-bar">
                    <div class="bg-container-1">
                        <div>
                            <el-button type="primary" :icon="Search" class="stbutencx" @click="selectHandler">查询</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">HOLD单</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">取消HOLD单</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">车间调整</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">流程调整</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">合染</el-button>
                            <el-button type="primary" :icon="Search" class="stbutencx">取消合染</el-button>
                            <!-- <el-button type="success" :icon="CirclePlus" class="stbutenxz"
                                @click="addHandler">新增</el-button>
                            <el-button plain :icon="Delete" @click="deleteHandler">删除</el-button>
                            <el-button plain v-if="shen == 0" :icon="EditPen" @click="changeGetS(1)">审核</el-button>
                            <el-button plain v-if="shen == 1" :icon="EditPen" @click="changeGetS(0)">反审</el-button> -->
                        </div>
                    </div>
                </div>
            </div>
        </div>

        <div class="gang"></div>
        <div ref="tablediv" style="padding: 10px; box-sizing: border-box;min-height:100%;background-color: #fff;">

            <a-tabs   :lazy-load="true" default-active-key="0" @change="changeGet">
                <a-tab-pane key="0" title="待处理">
                    <!-- <AgGridVuesCopys style="height:72vh;" class="ag-theme-alpine " :columnDefs="tc"
                        :rowData="tableCon.tableConter" :defaultColDef="defaultColDef" rowSelection="multiple"
                        @grid-ready="gridReady" :enableColResize="true">
                    </AgGridVuesCopys> -->
                    <AgGridVuesCopys style="height:300px" class="ag-theme-alpine" :columnDefs="tc"
                        :rowData="tableCon.tableConter" :defaultColDef="defaultColDef" :enableColResize="true"
                        rowSelection="multiple" @grid-ready="gridReady">
                    </AgGridVuesCopys>


                    <div class="pagings">
                        <paginationCopys :total="paging.total" v-model:current='pages' show-page-size show-total show-jumper
                            size="mini" @change="pagingChange" @page-size-change="pagingSizeChange" />
                    </div>
                </a-tab-pane>
                <a-tab-pane key="1" title="已处理">
                    <AgGridVuesCopys style="height:72vh;" class="ag-theme-alpine " :columnDefs="ta"
                        :rowData="tableConA.tableConter" :defaultColDef="defaultColDef" @grid-ready="gridReadyA">
                    </AgGridVuesCopys>

                    <div class="pagings">
                        <paginationCopys :total="paging.total" v-model:current='pages' show-page-size show-total show-jumper
                            size="mini" @change="pagingChange" @page-size-change="pagingSizeChange" />
                    </div>
                </a-tab-pane>
            </a-tabs>
        </div>
    </div>
</template>

<script lang="ts">
import { post, get } from "@/api/http";
import { Search, CirclePlus, Delete, EditPen } from "@element-plus/icons-vue";
// import {
//     useTable,
//     useRowKey,
//     useTableColumn,
//     usePagination,
//     useRowSelection,
// } from "@/hooks/table";

import textClothRequires from '@/views/Aps/planOrderA/selectList/textClothRequires.vue'
import { useRouter } from 'vue-router';
import { ref, reactive, onMounted, onActivated, onUnmounted, watch } from "vue";
// import Toolbar from "@/components/Toolbar.vue";
import { Form, Message, Modal, Pagination } from "@arco-design/web-vue";
import cheCkFirstRate from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkFirstRate.vue'             //一等品
import cheCkBumpWhite from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkBumpWhite.vue'             //撞白
import cheCkwetRubbing from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkwetRubbing.vue'           //问擦提升
import cheCkChlorineResistant from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkChlorineResistant.vue'           //耐氯提升
import cheCkstainResistance from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkstainResistance.vue'//白色防沾处理
import cheCkrcInfo from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkrcInfo.vue'                   // 白色RC处理
import cheCkResistanceYellow from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkResistanceYellow.vue'                   // 抗黄处理
import CheCkdialPrinting from '@/views/Aps/planOrderA/cheCkBoxComm/CheCkdialPrinting.vue'       //拔印
import cheCkrepeatPack from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkrepeatPack.vue'           //重打包
import cheCKneedEnterPot from '@/views/Aps/planOrderA/cheCkBoxComm/cheCKneedEnterPot.vue'       //需进缸
import cheCkhyperthermiaWhite from '@/views/Aps/planOrderA/cheCkBoxComm/cheCkhyperthermiaWhite.vue'       //高温定坯除白胶草
import cheCktakeDyeFee from '@/views/Aps/planOrderA/cheCkBoxComm/cheCktakeDyeFee.vue'           //收取染费
// import { FormInstance } from "@arco-design/web-vue/es/form";
// import emitter from "@/hooks/useEventBus";
// import validate from "@/hooks/useValidate";
//import { baseURL } from '../../../api/axios.config'
// import axios from "axios";
// import filedownload from 'js-file-download'
import "ag-grid-community/styles/ag-grid.css";
import "ag-grid-community/styles/ag-theme-alpine.css";
import {  } from "ag-grid-vue3";
//import aag from "./AGbut"
//import aag from "./agbuut.vue"
interface ClothSet {
    id?: any;
    serialNumber?: number | undefined,
    mercery?: string | undefined;
    deleteState?: any
    remark?: string | undefined;
    productionMode?: string | undefined;
    createName?: string | undefined;
    createTime?: string | undefined;
    updateName?: string | undefined;
    updateTime?: string | undefined;
}
interface pagings {
    size: number | string,
    total: number | string,
}
export default {
    name: "productionMode",
    setup() {
        const headerShow = ref<boolean>(true)
        const pages = ref(1);
        const pageData = reactive<{
            clothList: ClothSet[]
            showAdd: boolean
            sideTitle: string
            dropDownData: any
            pageLoading: boolean,
            theight: number,
            tablediv: any,
            rHeight: number | undefined,
            importAdd: boolean
        }>({
            clothList: [],
            showAdd: false,
            sideTitle: "计划订单",
            dropDownData: "",
            pageLoading: false,
            theight: 0,
            tablediv: null,
            rHeight: 0,
            importAdd: false
        });
        const paging: pagings = reactive({
            size: 10,
            total: 30,
        })
        let shen = ref(0);
        const tableCon = reactive({
            tableConter: [{
                // firstRate: 1,
                // bumpWhite:0,
                // wetRubbing:1,
                // chlorineResistant:1,
                // stainResistance:0,
                // rcInfo:0,
                // resistanceYellow:0,
                // dialPrinting:0,
                // repeatPack:0,
                // needEnterPot:0,
                // hyperthermiaWhite:0,
                // takeDyeFee:0,
                // detail1Id:532423432432432
                // clothRequires: ["要求项目,本次要求,默认要求",
                //     "要求项目,本次要求,默认要求",
                //     "新野之战,鼠辈！,鼠辈！",
                //     "赤壁之战,主公！,主公！",
                //     "长平之战,但使龙城飞将在,但使龙城飞将在"]

            }],
        });
        const tableConA = reactive({
            tableConter: [],
        });
        //待处理/已处理 表头
        let columnDefs = [
            {
                rowHeight: 100,
                headerName: '',//选择列头部显示的文字，可以为空
                checkboxSelection: true,//设置为ture显示为复选框
                headerCheckboxSelection: true, //表头是否也显示复选框，全选反选用
                pinned: 'left', //固定再左边
                width: 50 //列的宽度
            },
            { headerName: "下单日期", field: "authorizedStrengthTime", },
            { headerName: "下单部门", field: "orderDepartment" },
            { headerName: "染整单号", field: "clientDyeCode" },
            { headerName: "客户名称", field: "customName", },
            { headerName: "客订名称", field: "customOrderName" },
            { headerName: "布号", field: "clothCode" },
            { headerName: "品名", field: "'productName'", },
            { headerName: "色号", field: "colorCode" },
            { headerName: "确认色", field: "affirmColor" },
            { headerName: "色称", field: "colorName", },
            { headerName: "对色资料", field: "contrastColor" },
            { headerName: "匹数", field: "houseNum" },
            { headerName: "成品重量", field: "finishedWeight", },
            { headerName: "投染重量", field: "castDyeWeight" },
            { headerName: "总损耗", field: "allLoss" },
            { headerName: "订单性质", field: "orderNature", },
            { headerName: "布种类别", field: "greyType" },
            { headerName: "染色类型", field: "dyeingType" },
            { headerName: "缸型", field: "cylinderType", },


            { headerName: "生产车间", field: "workshop" },
            { headerName: "客户要求", field: "clothRequires", },


            { headerName: "总部工艺", field: "hqCraft", },
            {
                headerName: '收费项',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "整理收费项目", field: "trimCharges", },
                    { headerName: "合染类型", field: "joinDyeType" },
                    { headerName: "一等品", field: "firstRate" },
                    { headerName: "撞白", field: "bumpWhite", },
                    { headerName: "湿擦提升", field: "wetRubbing" },
                    { headerName: "耐氯提升", field: "chlorineResistant" },
                    { headerName: "白色防沾处理", field: "stainResistance", },
                    { headerName: "白色RC处理", field: "rcInfo" },
                    { headerName: "抗黄处理", field: "resistanceYellow", },
                    { headerName: "拔印", field: "dialPrinting" },
                    { headerName: "重打包", field: "repeatPack" },
                    { headerName: "需进缸", field: "needEnterPot", },
                    { headerName: "高温定坯除白胶草", field: "hyperthermiaWhite" },
                    { headerName: "收取染费", field: "takeDyeFee" }
                ]
            },
            { headerName: "门幅", field: "efficacious" },
            { headerName: "克重", field: "gramWeight" },


            {
                headerName: '总部',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "商品号", field: "tradeCode", },
                    { headerName: "商品名称", field: "tradeName" },
                    { headerName: "成品布号", field: "finishedClothCode" },
                    { headerName: "成品名称", field: "finishedClothName", },
                    { headerName: "商品门幅", field: "tradeEfficacious" },
                    { headerName: "商品克重", field: "tradeGramWeight" },
                    { headerName: "商品色号", field: "tradeColorCode", },
                    { headerName: "商品色称", field: "tradeColorName" },
                ]
            },


            {
                headerName: '生产状态',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "存坯条数", field: "repertoryNum", },
                    { headerName: "欠坯条数", field: "oweRepertoryNum" },
                    { headerName: "已开单条数", field: "createOrderNum" },
                    { headerName: "欠开单条数", field: "oweCreateOrderNum", },
                    { headerName: "已染色条数", field: "deyNum" },
                    { headerName: "欠染色条数", field: "oweDeyNum" },
                    { headerName: "已批核条数", field: "auditNum", },
                    { headerName: "欠批核条数", field: "oweAuditNum" },
                    { headerName: "已出货条数", field: "outNum", },
                    { headerName: "未出货条数", field: "oweOutNum" },
                    { headerName: "HOLD单条数", field: "holdNum" },
                ]
            },

            {
                headerName: '重点工序',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "定坯", field: "orientStock", },
                    { headerName: "烧毛", field: "singeing" },
                    { headerName: "长车", field: "longVehicle" },
                    { headerName: "拉针机", field: "needleDrawing", },
                    { headerName: "预缩机", field: "preShrinking" },
                    { headerName: "抓毛机", field: "combing" },
                    { headerName: "梳剪联机", field: "thinningShearing", },
                    { headerName: "摇粒机", field: "polarFleece" },
                ]
            },
            { headerName: "客户布号", field: "customClothCode" },
            { headerName: "客户品名", field: "customProductName", },
            { headerName: "客户色号", field: "customColorCode" },
            { headerName: "客户色称", field: "customColorName" },
            { headerName: "客户PO号", field: "customPo" },
            { headerName: "客户订单号", field: "customOrderCode", },
            { headerName: "款号", field: "styleNumber" },
            { headerName: "最终买家", field: "ultimatelyBuyer" },
            { headerName: "季节", field: "season" },
            { headerName: "成分", field: "ingredient", },
            { headerName: "标签类型", field: "labelFormatCode" },
            { headerName: "测试标准", field: "testCriterion" },
            { headerName: "对色光源", field: "coloringIlluminant" },
            { headerName: "敏感色", field: "sensitiveColor", },
            { headerName: "颜色深浅", field: "colorDepth" },
            { headerName: "送货地址", field: "deliveryAddress" },
            { headerName: "纸筒", field: "paperTube" },
            { headerName: "加重", field: "aggravate", },
            { headerName: "定型剪办要求", field: "finalize" },
            { headerName: "质检剪办要求", field: "quality" },
            { headerName: "门幅上限", field: "upperLimit" },
            { headerName: "门幅下限", field: "lowerLimit" },
            { headerName: "克重上限", field: "gramUpperLimit" },
            { headerName: "克重下限", field: "gramLowerLimit", },
            { headerName: "坯布编号", field: "greyCode" },
            { headerName: "坯布名称", field: "greylame" },
            { headerName: "坯布深浅", field: "greyColorDepth" },
            { headerName: "珠地边", field: "edge" },


            {
                headerName: '回修',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "缸号", field: "repairMachineCode", },
                    { headerName: "布号", field: "repairClothCode" },
                    { headerName: "布称", field: "repairProductName" },
                    { headerName: "色号", field: "repairColorCode", },
                    { headerName: "色称", field: "repairColorName" },
                ]
            },
            {
                headerName: '台巨 ',
                field: 'circulatCard',
                width: 600,
                children: [
                    { headerName: "Prod Id", field: "prodId", },
                    { headerName: "Seq No", field: "seqNo" },
                    { headerName: "SHIPTO地址", field: "shiptoSite" },
                ]
            },



            { headerName: "操作", },

        ];
        let ta: any[] = columnDefs.slice(0, 35)
        let tc: any[] = columnDefs.map((o) => {
            //let obj = {}
            if (o.headerName === '操作') {
                o['resizable'] = false
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "right"
                o["width"] = 80
                o['cellRenderer'] = {
                    template: `<el-button style="color:#165dff;"  link  @click="a">修改</el-button>`,
                    setup(props: any) {
                        const a = () => {
                            editHandler(props.params.data)
                        }
                        return {
                            a
                        }
                    }

                }
            }
            if (o.headerName == '收费项') {
                o.children.map((i) => {
                    if (i.headerName == '一等品') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkFirstRate
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '撞白') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkBumpWhite
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '湿擦提升') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkwetRubbing
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '耐氯提升') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkChlorineResistant
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '白色防沾处理') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkstainResistance
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '白色RC处理') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkrcInfo
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '抗黄处理') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkResistanceYellow
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '拔印') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = CheCkdialPrinting
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '重打包') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkrepeatPack
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '需进缸') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCKneedEnterPot
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '高温定坯除白胶草') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCkhyperthermiaWhite
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }

                    if (i.headerName == '收取染费') {
                        i['resizable'] = true
                        i['filter'] = false
                        i['sortable'] = false
                        i["pinned"] = "light"
                        i["width"] = 150
                        i['cellRenderer'] = cheCktakeDyeFee
                        i['cellRendererParams'] = {
                            color: (params: any,) => {

                            }
                        }
                    }


                })

            }
            if (o.headerName == '客户要求') {
                o['resizable'] = true
                o['filter'] = false
                o['sortable'] = false
                o["pinned"] = "light"
                o["width"] = 300
                o['cellRenderer'] = textClothRequires
                o['cellRendererParams'] = {
                    color: (params: any) => {

                    }
                }
            }
            return o
        })
        const defaultColDef = {
            sortable: true,
            filter: true,
            //  flex: 1,
            resizable: true,
        };
        //查询表单
        const fromList = reactive({
            page: 1,
            size: 20,
            autStartTime: '',
            autEndTime: '',
            clientDyeCode: "",
            customName: '',
            finishedClothCode: '',
            colorCode: '',
            colorName: '',
            delStartTime: '',
            delEndTime: "",
            customOrderCode: "",
            customOrderName: '',
            greyCode: '',
            orderNature: '',
            placeDepartment: '',
            auditState: '',
            craftState: '',
            openOrderState: '',
            cards: [],


        })

        //下拉框
        const basicData = reactive({
            dictTypeList: ['订单性质', '结算方式', '面料销售类型', '结算公司'],
            ProductionMode: [],
            machinType: [],
            ExchangecalorieClassify: [],
            saleType: [],
            labelFormat: [],
            UrgentCategory: [],

            orderNature: [],
            Calculation: [],
            plusMaterial: [],
            corporation: [],
            custom: [],
            hrEmployee: [],
            baCompany: [],
            VerifyStandard: [],
            coloringMatch: [],
            seasonSet: [],


            dyeingList: [],              //染整单号下拉框
        })
        /************************************************************查询************************************************************************************/
        //查询
        const selectHandler = () => {
            pages.value = 1;
            doRefresh(shen.value);
        }
        function doRefresh(data: any) {
            pageData.pageLoading = true
            fromList.auditState = data
            post({
                url: "/aps/planOrder/getDetailPage",
                data: fromList
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    //  console.log(data, "结果");
                    tableCon.tableConter = data.data;
                    tableConA.tableConter = data.data;
                    paging.total = data.total;
                    //     // pagination.setTotalSize(data.total);

                }
            })
                .catch(console.log).finally(() => {
                    pageData.pageLoading = false
                })
        }
        /***************************************************删除***************************************************************************** */
        const trigger = ref('1');
        const gridOption = ref();
        const gridReady = (params: any) => {
            gridOption.value = params.api
        }
        const gridOptionA = ref()
        const gridReadyA = (params: any) => {
            gridOptionA.value = params.api
        }
        const deleteHandler = () => {
            var arr = [];
            if (trigger.value == '1') {
                if (shen.value == 0) {
                    arr = gridOption.value.getSelectedRows().map((item) => {
                        return item.id
                    })
                } else {
                    arr = gridOptionA.value.getSelectedRows().map((item) => {
                        return item.id
                    })
                }
            } else {
                if (shen.value == 0) {
                    arr = gridOption.value.getSelectedRows().map((item) => {
                        return item.id
                    })
                } else {
                    arr = gridOptionA.value.getSelectedRows().map((item) => {
                        return item.id
                    })
                }
            }

            //console.log(gridOption.value.getSelectedRows(), "lkj");
            if (arr.length === 0) {
                Message.warning({
                    content: "请选择要删除的数据",
                    duration: 5000,
                });
                return;
            }
            // console.log(arrs);
            Modal.confirm({
                title: "系统提示",
                content: "确认删除选中的数据?",
                onOk() {
                    post({
                        url: "aps/planOrder/delete",
                        data: arr,
                    }).then(({ code, data, message }: any) => {
                        // console.log(code,"删除的状态码")
                        if (code === 200) {
                            Message.success({
                                content: "删除成功",
                                duration: 5000,
                            });
                            doRefresh(shen.value)
                            pages.value = 1;
                        } else {
                            Message.error({
                                content: message,
                                duration: 5000,
                            });
                        }
                    });
                },
            });
        };

        /*************************************************修改***********************************************************************************/
        const editHandler = (record: any) => {
            // initCum();
            //详情
            pageData.sideTitle = '修改资料'
            pageData.showAdd = true
        };
        /**************************************************审核******************************************************************************** */
        //审核
        function changeGetS(auditState: Number) {
            var arr = [];
            let s = ''
            if (trigger.value == '1') {
                if (auditState == 1) {
                    console.log(s)
                    arr = gridOption.value.getSelectedRows().map((item) => {
                        s = "确认审核选中的数据?"
                        return item.detail1Id
                    })
                    console.log(s)
                } else {
                    arr = gridOptionA.value.getSelectedRows().map((item) => {
                        s = "确认反审选中的数据?"
                        return item.detail1Id
                    })
                }
            } else {
                if (auditState == 1) {
                    arr = gridOption.value.getSelectedRows().map((item) => {
                        s = "确认审核选中的数据?"
                        return item.id
                    })
                } else {
                    arr = gridOptionA.value.getSelectedRows().map((item) => {
                        s = "确认反审选中的数据?"
                        return item.id
                    })
                }

            }

            if (arr.length > 0) {
                let data = []
                data = arr.map((item) => {
                    return { detail1Id: item, auditState: auditState }
                })
                console.log(data, 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa')
                Modal.confirm({
                    title: "系统提示",
                    content: s,
                    onOk() {
                        post({
                            url: "/aps/planOrder/audit",
                            data: data,
                        }).then(({ code, data, message }: any) => {
                            // console.log(code,"删除的状态码")
                            if (code === 200) {
                                Message.success({
                                    content: "审核成功",
                                    duration: 5000,
                                });
                                pages.value = 1;
                                if (data.auditState == 1) {
                                    zd(0);
                                } else {
                                    doRefresh(1);
                                }

                            } else {
                                Message.error({
                                    content: message,
                                    duration: 5000,
                                });
                            }
                        });
                    },
                });
            } else {
                Message.warning({
                    content: "请选择要审核的数据",
                    duration: 5000,
                });
                return;
            }
        }

        /*************************************************新增************************************************************************************ */
        const router = useRouter()
        const addHandler = () => {
            router.push('/productmasterdata/order/planOrder/planOrderXin')
        }
        /************************************************待处理/已处理页签*******************************************************************************************/
        function changeGet(key: any) {
            trigger.value = key
            console.log(key)
            if (key == 0) {
                shen.value = 0
                doRefresh(shen.value)
            } else {
                shen.value = 1
                doRefresh(shen.value)
            }
        };
        /************************************************分页***********************************************************************************************/
        //页改变
        const pagingChange = (current: number) => {
            // console.log(current, "分页改变");
            pages.value = current;
            console.log(shen.value)
            doRefresh(shen.value);
        }
        //页条改变
        const pagingSizeChange = (pageSize: number) => {
            //  console.log(pageSize, "条数")
            pages.value = 1;
            paging.size = pageSize;
            doRefresh(shen.value);
        }
        /****************************************************选择日期********************************************************************************************** */
        function onSelect(dateString, date) {
            console.log('onSelect', dateString, date);
        }

        function onChange(dateString, date) {
            console.log('onChange: ', dateString, date);
            fromList.endTime = dateString
        }
        /******************************************************染整单号.客户名称.客户订单号.客订名称.订单性质下拉选查询************************************ */
        //下拉框得到焦点
        let pan = 0
        const focusSel = (value: any) => {
            let obj = {}
            switch (value) {
                case 1:
                    obj = { clientDyeCode: "" }
                    pan = 1
                    break;
                case 2:
                    obj = { customName: '' }
                    pan = 2
                    break;
                case 3:
                    obj = { customOrderCode: '' }
                    pan = 3
                    break;
                case 4:
                    obj = { customOrderName: '' }
                    pan = 4
                    break;
                case 5:
                    obj = { orderNature: '' }
                    pan = 5
                    break;
                case 6:
                    obj = { placeDepartment: '' }
                    pan = 6
                    break;
            }
            selCxAll(obj)
        }
        //下拉数据  
        let pageDataList = ref([])
        let options = ref<any>(pageDataList.value);
        let loading = ref(false);
        const handleSearch = (value: any) => {
            let ob = {}
            switch (pan) {
                case 1:
                    ob = { clientDyeCode: value }
                    break;
                case 2:
                    ob = { customName: value }
                    break;
                case 3:
                    ob = { customOrderCode: value }
                    break;
                case 4:
                    ob = { customOrderName: value }
                    break;
                case 5:
                    ob = { orderNature: value }
                    break;
            }

            loading.value = true;
            selCxAll(ob);
            options.value = pageDataList.value;
            loading.value = false;
        };
        //下拉框查询
        function selCxAll(val: any) {
            post({
                url: "/aps/planOrder/getDropValue",
                data: val
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    pageDataList.value = data;
                } else {
                    Message.error({
                        content: "查询失败！",
                        duration: 5000,
                    });
                }
            });

        };

        let selectChange = () => {
        };

        /******************************************************成品布号下拉选查询*************************************************************** */
        const focusSelBh = () => {
            setCxAllBh({ finishedClothCode: '' })
        };
        const handleSearchBh = (value: any) => {
            let ob = { finishedClothCode: value }
            loading.value = true;
            setCxAllBh(ob)
            options.value = pageDataList.value;
            loading.value = false;
        };
        function setCxAllBh(val: any) {
            post({
                url: "/aps/planOrder/getDropValue2",
                data: val
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    pageDataList.value = data;
                } else {
                    Message.error({
                        content: "查询失败！",
                        duration: 5000,
                    });
                }
            });
        }
        /******************************************************色号.色称.坯布编号下拉选查询************************************************************* */
        const focusSelSh = (val: any) => {
            let ob = {}
            switch (val) {
                case 1:
                    ob = { colorCode: '' }
                    break;
                case 2:
                    ob = { colorName: '' }
                    break;
                case 3:
                    ob = {}
                    break;
            }
            setCxAllSH(ob)

        };
        const handleSearchSh = (value: any) => {
            let ob = { greyCode: value }
            loading.value = true;
            setCxAllSH(ob)
            options.value = pageDataList.value;
            loading.value = false;
        };
        function setCxAllSH(val: any) {
            post({
                url: "/aps/planOrder/getDropValue1",
                data: val
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    pageDataList.value = data;
                } else {
                    Message.error({
                        content: "查询失败！",
                        duration: 5000,
                    });
                }
            });
        }
        /******************************************************已下流转卡号************************************************************* */
        const focusSelLz = (val: any) => {
            setCxAllLz({ flowCardCode: '' })
        };
        function setCxAllLz(val: any) {
            post({
                url: "/aps/circulatCard/getDropValue",
                data: val
            }).then(({ data, code }: any) => {
                if (code === 200) {
                    pageDataList.value = data;
                } else {
                    Message.error({
                        content: "查询失败！",
                        duration: 5000,
                    });
                }
            });
        }


        return {
            headerShow,
            selectHandler,
            pages,
            doRefresh,
            pageData,
            paging,
            shen,
            tableCon,
            tableConA,
            deleteHandler,
            trigger,
            gridOption,
            gridReady,
            gridOptionA,
            gridReadyA,
            changeGetS,
            addHandler,
            changeGet,
            tc,
            ta,
            defaultColDef,
            editHandler,
            columnDefs,
            pagingChange,
            pagingSizeChange,
            fromList,
            basicData,
            Delete,
            Search,
            CirclePlus,
            EditPen,
            onSelect,
            onChange,
            focusSel,
            pageDataList,
            options,
            loading,
            handleSearch,
            selectChange,
            pan,
            focusSelBh,
            handleSearchBh,
            setCxAllBh,
            focusSelSh,
            handleSearchSh,
            setCxAllSH,
            focusSelLz,
            setCxAllLz,
            router
        };
    },
    components: {
        textClothRequires,
        cheCkFirstRate,
        cheCkBumpWhite,
        cheCkwetRubbing,
        cheCkChlorineResistant,
        cheCkstainResistance,
        cheCkrcInfo,
        cheCkResistanceYellow,
        CheCkdialPrinting,
        cheCkrepeatPack,
        cheCKneedEnterPot,
        cheCkhyperthermiaWhite,
        cheCktakeDyeFee
    }
};
</script>
<style  lang="less" scoped>
.pagings {
    margin-top: 10px;
    display: flex;
    justify-content: center;
}

.arco-input-wrapper {
    background-color: #fff !important;
    border: 1px solid #cccccc;
}

.arco-form-item-status-error .arco-input-wrapper:not(.arco-input-disabled),
.arco-form-item-status-error .arco-textarea-wrapper:not(.arco-textarea-disabled) {
    border: 1px solid #f53f3f;
}


/********************************************** */
.stbutencx {
    background-color: #409eff;

    &:hover {
        background-color: #79bbff;
    }
}


.ag-header-cell-resize::after {
    top: 0 !important;
    height: 100% !important;
}

.ag-cell {
    border-right: 1px solid #D9DDDF !important;
}

.stbutenxz {
    background-color: #67c23a;

    &:hover {
        background-color: #b3e19d;
    }
}

.arco-row {
    margin-bottom: 0px;
}

.ag-header-group-cell-label,
.ag-header-cell-label {
    justify-content: center !important
}

.ag-header-cell,
.ag-header-group-cell {
    border-right: 1px solid #dde2eb !important;
}


/************************************************** */
</style>